import { defineStore } from "pinia";
import { ref, reactive, computed } from "vue";
export const useSettingStore = defineStore("SettingStore", () => {
    // 弹窗显示状态
    const Setting = reactive({
        size: "400px",
        title: "个性化设置",
        tips: "自定义偏好设置 & 实时预览",
        status: true,
        SegmentedIndex: "Genneral",
        Segmented: [
            {
                label: "Apple",
                value: "Genneral",
                icon: "Apple",
            },
            {
                label: "Cherry",
                value: "Cherry",
                icon: "Cherry",
            },
            {
                label: "Grape",
                value: "Grape",
                icon: "Grape",
            },
            {
                label: "Orange",
                value: "Orange",
                icon: "Orange",
            },
        ],
        FooterButton: [
            {
                label: "复制配置",
                type: "primary",
                icon: "",
            }, {
                label: "加载配置",
                type: "primary",
                icon: "",
            }, {
                label: "恢复默认",
                type: "primary",
                icon: "",
            }
        ],
        Setting: {
            Genneral: {
                title: "常规",
                Setting: {
                    language: {
                        title: "多语言",
                        Setting: {}
                    },
                    Layout: {
                        title: "布局",
                        Setting: {
                            IconSidebar: {
                                title: "图标侧边栏",
                                type: "switch",
                                value: true,
                                activeValue: true,
                                inactiveValue: false,
                                activeText: "",
                                inactiveText: "",
                            },
                            Sidebar: {
                                title: "普通侧边栏",
                                type: "switch",
                                value: true,
                                activeValue: true,
                                inactiveValue: false,
                                activeText: "",
                                inactiveText: "",
                                component:{
                                    
                                }
                            },
                            UserInfo: {
                                title: "用户信息",
                                type: "switch",
                                value: true,
                                activeValue: true,
                                inactiveValue: false,
                                activeText: "",
                                inactiveText: "",
                            }
                        }
                    }
                }
            }
        }
    })
    const SettingList = computed(() => {
        let index = Setting.SegmentedIndex
        if (index) {
            let Find = Setting.Setting[index]
            if (Find) {
                return Find.Setting
            } else {
                return {}
            }
        } else {
            return {}
        }
    })

    // 设置弹窗状态
    function SetDrawerStatus(status: boolean) {
        if (status === undefined) {
            status = !Setting.status
        }
        Setting.status = Boolean(status)
    }

    return {
        Setting,
        SettingList,
        SetDrawerStatus,
    }
})